<template>
	<view>
			<u-navbar back-text="" title="往约到家" :background="background" title-color='#FFF' back-icon-color='#FFF'></u-navbar>
			
			<view class="top_box" style="">
				<u-icon  style="margin-top: 20rpx;" name="clock-fill"  color="#ff0000"  size="45"></u-icon>
					<text class="status">下单成功</text>
					<view class="remark">请耐心等待服务~</view>
					<view class="btns">
						<u-button   class="again"  :custom-style="customStyle" size="medium" @click="btn(1)">再来一单</u-button>
						<u-button :custom-style="customStyle"size="medium"  @click="btn(2)">查看订单</u-button>
					</view>
			</view>
			<u-cell-group style="margin-top: 15rpx;">
				<u-cell-item  title="服务项目信息"  value=""  ></u-cell-item>
			</u-cell-group>	
				
				<u-cell-group style="">
					<u-cell-item  title="足浴*1"  value="￥298"  :arrow="false"></u-cell-item>
					<u-cell-item  title="拔火罐*1" value="￥68" :arrow="false"></u-cell-item>
				</u-cell-group>
				<u-cell-group style="margin-top: 15rpx;">
					<u-cell-item  title="订单信息"  value=""  ></u-cell-item>
				</u-cell-group>	
				<u-cell-group style="">
					<u-cell-item  title="订单号"  value="DG48559652986652"  :arrow="false"></u-cell-item>
					<u-cell-item  title="服务时间" value="2021-07-02 15:00" :arrow="false"></u-cell-item>
					<u-cell-item  title="支付方式" value="支付宝" :arrow="false"></u-cell-item> 
					<u-cell-item  title="服务地址" value="南山区深南大道28号" :arrow="false"></u-cell-item>
				</u-cell-group>
		
				
	</view>
</template>

<script>
	export default {
		data() {
			return {
				background:{
					backgroundColor: '#19BE6B',
					backgroundSize: 'cover',
					backgroundImage: 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))',			
				},
				customStyle: {
						marginTop: '20px', // 注意驼峰命名，并且值必须用引号包括，因为这是对象
						// color: 'red',
						width:'80rpx',
						textAlign:'center',
						//float:'left',
						marginLeft:'50rpx',
						paddingBotton:'80rpx'
					}
				
				
			}
		},	
		onLoad(option){
			console.log(option.id);
			this.orderid=option.id;
		},
		methods:{
			btn(btn){
				if(btn==1){
					this.$u.route({
						url: '/pages/appointment/index',
						params: {
							id: this.orderid
						}
					})
				}else{
					uni.switchTab({
						url: '/pages/orderList/index',
						params: {
							id: this.orderid
						}
					})
					
				}
			}
		}	
	}
</script>

<style>
	.top_box{
		text-align: center;
		height: 350rpx;
		background-color: #FFFFFF;
		padding-top: 50rpx;
	}
	.status{
		font-size: 30rpx;
		margin-top: 80rpx;
		font-weight: 700;
	}
	.remark{
		margin-top: 30rpx;
	}
	.btns{
		width: 100%;
		/* background-color: #007AFF; */
	}
	.again{
		background-color: #FA3534!important;
		color: #FFFFFF!important;
	}
</style>
